<!--
 * @Description: ------------ fileDescription -----------
 * @Author: snows_l snows_l@163.com
 * @Date: 2024-08-05 12:46:00
 * @LastEditors: snows_l snows_l@163.com
 * @FilePath: /BLOG/src/App.vue
-->

<template>
  <el-config-provider :locale="zhCn">
    <RouterView />
  </el-config-provider>
</template>

<script setup lang="ts">
// ElConfigProvider 组件
import { ElConfigProvider } from 'element-plus';
// 引入中文包
import { getProjectConfig } from '@/api/common';
import { useAppStore } from '@/store/app';
import { setDocmentTitle } from '@/utils/common';
import { setPrimaryColor } from '@/utils/theme';
import zhCn from 'element-plus/dist/locale/zh-cn.mjs';
import { onMounted, watch } from 'vue';
import { RouterView, useRoute } from 'vue-router';
import init from './init';
import { routes } from './router/index';

const route = useRoute();
const store = useAppStore();
let routesList = [];
routes.forEach(item => {
  if (item.children) {
    item.children.forEach(child => {
      routesList.push(child);
    });
  } else {
    routesList.push(item);
  }
});

const inputPaths = ['/article/detail', '/msg-board', '/about/device', '/about/friend-link', '/about/zone'];

if (localStorage.getItem('primaryColor')) {
  setPrimaryColor(localStorage.getItem('primaryColor'));
}

const getProjectConfigFn = () => {
  getProjectConfig().then(res => {
    if (res.code === 200) {
      store.SET_PROJECTCONFIG(res.data);
    }
  });
};

// 设置项目配置
getProjectConfigFn();
// 初始化
init();

// 设置网页标题
const setDocumentTitle = () => {
  const bigCategory = ['1', '2', '3'];
  let title = '';
  for (let i = 0; i < routesList.length; i++) {
    if (routesList[i].path === route.path) {
      if (route.path == '/article/category') {
        if (bigCategory.includes(route.query.type)) {
          const articleCategoryMap = {
            1: '前端',
            2: '后端',
            3: '其他分享'
          };
          title = articleCategoryMap[route.query.type];
        } else {
          title = route.query.category;
        }
      } else {
        title = routesList[i].meta.title;
      }
      break;
    }
  }
  let preFix = store.projectConfig.title;

  if (title) {
    setDocmentTitle('☂ ' + title + ' | ' + preFix);
  } else {
    setDocmentTitle(preFix);
  }
};

onMounted(() => {
  // 移除首屏加载动画
  if (document.getElementById('Loading')) document.getElementById('Loading').remove();
});

watch(
  () => route.path,
  () => {
    setDocumentTitle();
    if (inputPaths.includes(route.path)) {
      getProjectConfigFn();
    }
  }
);

watch(
  () => route.query.type,
  () => {
    setDocumentTitle();
  }
);

watch(
  () => route.query.category,
  () => {
    setDocumentTitle();
  }
);
</script>

<style lang="scss" scoped></style>
